<template>
  <div id="login" class="animated bounceOutLeft">
    <h2 class="loginTest">登录</h2>
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="账号" prop="userName">
        <el-input
          type="text"
          v-model="form.userName"
          auto-complete="off"
        ></el-input>
      </el-form-item>
      <el-form-item label="密码" prop="passWork">
        <el-input
          type="password"
          v-model="form.passWork"
          auto-complete="off"
          @keydown.enter="onSubmit"
        ></el-input>
      </el-form-item>
      <el-button type="primary" @click="onSubmit">登录</el-button>
    </el-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      form: {
        userName: "",
        passWork: "",
      },
    };
  },
  mounted() {
      localStorage.removeItem("token");
    // console.log(this.$apiServer);
    // console.log(this.$axios);
  },
  methods: {
    onSubmit(event) {
      let data = this.form;
      console.log(data);
      let _this = this;
      this.$axios({
        method: "post",
        url: _this.$apiServer.login,
        params: {
          username: data.userName,
          password: data.passWork,
        },
      }).then(function (res) {
        console.log(res);
        if (res.data.code == "200") {
          _this.$store.state.token = res.data.token;
          localStorage.setItem("token", res.data.token)
           localStorage.setItem("username", res.data.username)
             localStorage.setItem("uid", res.data.uid)
          _this.$router.push({ path: "/Home" });
            _this.$message({
              type: "success",
              message: "登陆成功!",
            });
        } else {
               _this.$message({
              type: "error",
              message: "用户名或者密码不正确!",
            });
        }
      });
    },
  },
};
</script>

<style >
@import url("./css/login.css");
</style>